<template>
  <div class="w">
    <div>
      <div class="header">
        <i class="el-icon-s-home"></i>
        <span style="color:#e9a539">房产经纪</span>
      </div>
      <div class="bigBox" v-for="item in agentsList " :key="item.id">
        <AgentsDetail :item="item"/>
      </div>
    </div>
  </div>
</template>

<script>
import AgentsDetail from './components/AgentsDetail.vue'
import {getAgentsList} from '@/api/agents.js'
export default {
  components:{AgentsDetail, },
  data () {
    return {
     agentsList:[] 
    }
  },
  methods:{
    async getAgentsListFn(){
      const {data}=  await getAgentsList()
      this.agentsList =data
      // console.log(this.agentsList);
    }
  },
  created(){
    this.getAgentsListFn()
  }
};
</script>

<style lang="less" scoped>
    .w {
      width: 50vw;
    }
    .header {
      margin: 1.042vw 0;
        i{
        margin-right: 5px;
        }
      span {
        font-weight: bold;
        font-size: 1.5vw;
      }
    }
    .el-icon-s-home {
      color:#e9a539 ;
      font-size: 1.5vw;
      margin-right: 5px;
    }
</style>